<template>
    <div class="record">
        <div class="flex-between">
            <div class="flex">
                <img :src="logo" alt="" :onerror="errorImg">
                <span>{{name}}</span>
            </div>
            <div class="date">{{date}}</div>
        </div>
        <div class="flex-between bottom">
            <h3 v-if="pay_type == 0">
                <span v-if="type == 1">捐款成功</span>
                <span v-if="type == 2">充值成功</span>
                <span v-if="type == 3">提现成功</span>
                <span v-if="type == 5">筹款成功</span>
            </h3>
            <h3 v-if="pay_type == 2">
                <span v-if="type == 1">充值中</span>
                <span v-if="type == 2">充值成功</span>
                <span v-if="type == 3">充值失败</span>
            </h3>
            <h3 v-if="pay_type == 3">
                <span v-if="type == 1">提现中</span>
                <span v-if="type == 2">提现成功</span>
                <span v-if="type == 3">提现失败</span>
            </h3>
            <p class="flex" v-if="pay_type == 0"><span  v-if="type == 2 || type == 5">+</span><span   v-if="type == 1 || type == 3">-</span>{{score}}</p>
            <p  class="flex" v-if="pay_type != 0"><span  v-if="pay_type == 2">+</span><span  v-if="pay_type == 3">-</span>{{score}}</p>
        </div>
    </div>
</template>

<script>
    export default {
        name: "recordList",
        props:["score","logo","name","date","type","pay_type"],
        data(){
            return {
                errorImg:'this.src="'+ require('../assets/img/self-pic.png')+ '"',
            }
        }
    }
</script>

<style scoped lang="less">
    .record{
        padding: 30px 0;
        border-bottom: 2px solid #eee;
        .bottom{
            padding-top: 10px;
        }
        img{
            width: 56px;
            height: 56px;
            object-fit: cover;
            border-radius: 50%;
            margin-right: 14px;
        }
        span{
            font-size: 26px;
            color: #666666;
        }
        .date{
            font-size: 26px;
            color: #666666;
        }
        h3{
            font-size: 32px;
            color: #333333;
        }
        p{
            font-size: 40px;
            color: #185fff;
        }
    }
</style>
